import React from 'react'
// import { 
//   createStore,
//   bindActionCreators,
//  } from '../redux'

import { connect } from '../react-redux'
// 里面的每一个属性都是一个方法 每个方法都会返回一个 action 对象
import actionCreators1 from '../store/actionCreators/counter1'


class Counter1 extends React.Component {
  render() {
    return <div>
      <p>{this.props.number}</p>
      <button onClick={this.props.add1}>+</button>
      <button onClick={this.props.minus1}>-</button>
    </div>
  }
}

// 把仓库的总状态里面的 counter1 映射到组件的 props 上
const mapStateToProps = state => state.counter1

// export default connect(
//   mapStateToProps,
//   actionCreators1, // 将对象里面的每一个返回 action 对象的方法与 仓库中的 dispatch 映射关联起来并作为props传递给组件中
// )(Counter1)


export default connect(
  mapStateToProps,
  (dispatch) => { // 函数写法
    return {
      add1: () => dispatch(actionCreators1.add1()),
      minus1: () => dispatch(actionCreators1.minus1())
    }
  }
)(Counter1)
